<template>
  <page-header-wrapper :title="false">
    <a-card title="案件预警">
      <a-tabs v-model="tab" type="card" @change="onChange">
        <a-tab-pane key="1" tab="待排期案件"></a-tab-pane>
        <a-tab-pane key="2" tab="全部定稿案件"></a-tab-pane>
      </a-tabs>
      <div class="table-page-search-wrapper">
        <a-form-model
          layout="inline"
          :model="queryParam"
        >
          <a-row :gutter="15">
            <a-col :md="6" :sm="24">
              <a-form-model-item label="业务名称">
                <a-input v-model="queryParam['filter[business_name]']" placeholder="请输入业务名称"/>
              </a-form-model-item>
            </a-col>
            <a-col :md="6" :sm="24">
              <a-form-model-item label="合同编号">
                <a-input v-model="queryParam['filter[contract_no]']" placeholder="请输入合同编号"/>
              </a-form-model-item>
            </a-col>
            <template v-if="advanced">
              <a-col :md="6" :sm="24">
                <a-form-model-item label="业务编号">
                  <a-input v-model="queryParam['filter[business_no]']" placeholder="请输入业务编号"/>
                </a-form-model-item>
              </a-col>
              <a-col :md="6" :sm="24">
                <a-form-item label="提交时间">
                  <a-range-picker @change="onChangeSubmit"/>
                </a-form-item>
              </a-col>
              <a-col :md="6" :sm="24">
                <a-form-item label="指派时间">
                  <a-range-picker @change="onChangeSubmit1"/>
                </a-form-item>
              </a-col>
              <!--              <a-col :md="6" :sm="24">-->
              <!--                <a-form-item label="领取时间">-->
              <!--                  <a-range-picker @change="onChangeReceive" />-->
              <!--                </a-form-item>-->
              <!--              </a-col>-->
<!--              <a-col :md="6" :sm="24">-->
<!--                <a-form-model-item label="所属顾问">-->
<!--                  <a-select-->
<!--                    show-search-->
<!--                    v-model="queryParam['filter[adviser_uid]']"-->
<!--                    placeholder="输入要搜索的顾问姓名"-->
<!--                    :default-active-first-option="false"-->
<!--                    :show-arrow="false"-->
<!--                    :filter-option="false"-->
<!--                    :not-found-content="null"-->
<!--                  >-->
<!--                    <a-select-option v-for="(item,index) in searchSource" :key="index" :value="index">-->
<!--                      {{ item }}-->
<!--                    </a-select-option>-->
<!--                  </a-select>-->
<!--                </a-form-model-item>-->
<!--              </a-col>-->
<!--              <a-col :md="6" :sm="24">-->
<!--                <a-form-model-item label="专利流程">-->
<!--                  <a-select v-model="queryParam['filter[receive_uid]']" placeholder="请选择专利流程">-->
<!--                    <a-select-option v-for="(item,index) in processOpts" :key="index" :value="index">{{item}}-->
<!--                    </a-select-option>-->
<!--                  </a-select>-->
<!--                </a-form-model-item>-->
<!--              </a-col>-->
<!--              <a-col v-if="group == 'small_leader'" :md="6" :sm="24">-->
<!--                <a-form-model-item label="专利老师">-->
<!--                  <a-select v-model="queryParam['filter[patenteer]']" placeholder="请选择专利老师">-->
<!--                    <a-select-option v-for="(item,index) in patentOpts" :key="index" :value="index">{{item}}-->
<!--                    </a-select-option>-->
<!--                  </a-select>-->
<!--                </a-form-model-item>-->
<!--              </a-col>-->
            </template>
            <a-col :md="!advanced && 8 || 24" :sm="24">
                <span class='table-page-search-submitButtons' :style="advanced && { float: 'right', overflow: 'hidden' } || {}">
                  <a-button type="primary" @click="$refs.table.refresh(true)">搜索</a-button>
                  <a-button style="margin-left: 8px" @click="resetForm">重置</a-button>
                  <a @click="toggleAdvanced" style="margin-left: 8px">
                    {{ advanced ? '收起' : '展开' }}
                    <a-icon :type="advanced ? 'up' : 'down'"/>
                  </a>
                </span>
            </a-col>
          </a-row>
        </a-form-model>
      </div>
      <div class="table-operator">
        <s-table
          bordered
          ref="table"
          size="middle"
          :row-key="(record) => record.cb_id"
          :columns="warningColumns"
          :data="warningData"
        >
          <template slot="subject" slot-scope="text">
            <a-button size="small" type="link" @click="onShow">{{text[0]}}</a-button>
          </template>
          <template slot="action" slot-scope="text,record">
            <a-button :disabled="record.pid != ''" size="small" type="primary" @click="onSet(record.cb_id, record.zl_name)">设置</a-button>
          </template>
        </s-table>
      </div>
    </a-card>
    <a-modal
      title="排期设置"
      v-model="setVisible"
      @ok="onSubmit"
    >
      <a-form-model
        ref="setForm"
        :model="setForm"
        :rules="setRules"
        :label-col="labelCol"
        :wrapper-col="wrapperCol"
      >
        <a-form-model-item label="专利名" prop="zl_name">
          <a-input v-model="setForm.zl_name" type="text"/>
        </a-form-model-item>
        <a-form-model-item label="申请人" prop="applicant">
          <a-textarea v-model="setForm.applicant" :rows="3"></a-textarea>
        </a-form-model-item>
        <a-form-model-item label="备注">
          <a-textarea v-model="setForm.notes" :rows="3"></a-textarea>
        </a-form-model-item>
        <!--        <a-form-model-item label="客户身份证号">-->
        <!--          <a-input type="text" />-->
        <!--        </a-form-model-item>-->
        <!--        <a-form-model-item label="客户联系电话">-->
        <!--          <a-input type="text" />-->
        <!--        </a-form-model-item>-->
        <a-divider/>
        <a-form-model-item label="需要提交时间" prop="submit_time">
          <a-date-picker v-model="setForm.submit_time" @change="onChangeTime" />
        </a-form-model-item>
        <a-form-model-item label="选择提交资质" prop="zz_id">
          <a-select v-model="setForm.zz_id" @change="onSelect">
            <a-select-option v-for="(item,index) in qualificationsOpts" :key="index" :value="index">{{item}}</a-select-option>
          </a-select>
        </a-form-model-item>
        <a-form-model-item label="选择资质下的专利师" prop="patent_id">
          <a-select v-model="setForm.patent_id">
            <a-select-option v-for="item in patentOpts" :key="item.id" :value="item.id">{{item.name}}({{item.submit_num}})({{item.label}})</a-select-option>
          </a-select>
        </a-form-model-item>
      </a-form-model>
    </a-modal>
    <a-modal
      title="当前客户所有业务排期"
      v-model="visible2"
      :footer="null"
    >
      <a-table
        bordered
        size="middle"
        :columns="timeColumns"
        :data-source="timeData"
      >
      </a-table>
    </a-modal>
  </page-header-wrapper>
</template>

<script>
import storage from 'store'
import { STable } from '@/components'
import businessColumns from '@/columns/patent.process'
import { getAddSchedule, getPatentByCompany, getScheduleTask, postAddSchedule } from '@/api/patent.process'

export default {
  components: {
    STable
  },
  name: 'TaskWarning',
  data () {
    return {
      labelCol: { span: 8 },
      wrapperCol: { span: 14 },
      tab: '1',
      warningColumns: businessColumns.warning,
      warningData: parameters => {
        return getScheduleTask(Object.assign(parameters, this.queryParam)).then(res => {
          return res.result
        })
      },
      queryParam: {},
      setVisible: false,
      setForm: {
        submit_time: null
      },
      setRules: {
        zl_name: [{ required: true, message: '必须填写专利名称', trigger: 'blur' }],
        applicant: [{ required: true, message: '必须填写申请人', trigger: 'blur' }],
        submit_time: [{ required: true, message: '必须设置提交时间', trigger: 'blur' }],
        zz_id: [{ required: true, message: '必须选择提交资质', trigger: 'blur' }],
        patent_id: [{ required: true, message: '必须选择专利师', trigger: 'blur' }]
      },
      advanced: true,
      visible2: false,
      timeColumns: businessColumns.time,
      timeData: [],
      group: storage.get('group2'),
      qualificationsOpts: {},
      patentOpts: {}
    }
  },
  created () {
    this.queryParam['filter[is_pq]'] = '1'
  },
  methods: {
    onChangeSubmit (date, dateString) {
      this.queryParam['filter[submit_mats_time_start]'] = dateString[0]
      this.queryParam['filter[submit_mats_time_end]'] = dateString[1]
    },
    onChangeTime (date, dateString) {
      this.setForm['submit_time'] = dateString
    },
    onChangeSubmit1 (date, dateString) {
      this.queryParam['filter[appoint_time_start]'] = dateString[0]
      this.queryParam['filter[appoint_time_end]'] = dateString[1]
    },
    onChangeReceive (date, dateString) {
      this.queryParam['filter[received_at_start]'] = dateString[0]
      this.queryParam['filter[received_at_end]'] = dateString[1]
    },
    onSet (id, name) {
      this.setForm = {}
      this.setForm['zl_name'] = name
      this.setForm['id'] = id
      getAddSchedule(id).then(res => {
        this.qualificationsOpts = res.result.qualificationsOpts
        this.setVisible = true
      })
    },
    onSelect (value) {
      this.patentOpts = {}
      getPatentByCompany(value).then(res => {
        this.patentOpts = res.result.data
      })
    },
    onShow () {
      this.visible2 = true
    },
    resetForm () {
      this.queryParam = {}
    },
    toggleAdvanced () {
      this.advanced = !this.advanced
    },
    onChange (key) {
      if (key === '1') {
        this.queryParam['filter[is_pq]'] = '1'
        this.$refs.table.refresh(true)
      } else {
        delete this.queryParam['filter[is_pq]']
        this.$refs.table.refresh(true)
      }
    },
    onSubmit () {
      const app = this
      const data = {}
      for (const k in app.setForm) {
        data['schedule[' + k + ']'] = app.setForm[k]
      }
      app.$refs.setForm.validate(valid => {
        if (valid) {
          postAddSchedule(app.setForm.id, data).then(res => {
            app.setVisible = false
            app.$refs.table.refresh()
          })
        } else {
          return false
        }
      })
    }
  }
}
</script>

<style scoped>

</style>
